<button type="button" class="btn btn-primary" data-toggle="modal" data-target="#topology_modal" data-obj="{{ object.name }}" title="Show site topology">
    <i class="fa fa-signal" aria-hidden="true"></i>
    Topology
</button>

<div class="modal fade" id="topology_modal" tabindex="-1" role="dialog">
    <div class="modal-dialog modal-lg" role="document">
        <div class="modal-content">
                <div class="modal-header">
                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                    <h2 class="modal-title" style="text-align: center;"><a href={% url 'plugins:nextbox_ui_plugin:topology' %}?site_id={{ object.id }}>{{ object.name }} Topology</a></h2>
                </div>
        <iframe src="{% url 'plugins:nextbox_ui_plugin:site_topology' %}?site_id={{ object.id }}" style="height: 75vh; width: 100%;"></iframe>
        </div>
    </div>
</div>